<!DOCTYPE html>
<html>

<p id="demo">一个段落222</p>

<head>
<meta charset="utf-8">
</head>

<script>
function validate1() {
    var e = document.getElementById("id1");
    if (e.checkValidity() == false) {       //布尔属性值，返回 input 输入值是否合法 注意不要写成 e.checkVisibility
        if (e.validity.rangeOverflow) {
            document.getElementById("demo").innerHTML = 'to big';
        } else if (e.validity.rangeUnderflow) {
            document.getElementById("demo").innerHTML = 'to small';
        } else {
            document.getElementById("demo").innerHTML = e.validationMessage;
        }
    } else {
        document.getElementById("demo").innerHTML = 'ok';
    }
}
</script>


<body>

<input id="id1" type="number" min="12" max="32" required="required">
<button onclick="validate1()">验证</button>

</body>

</html>
